﻿@model IEnumerable<PTUDW_CNTN2010_F_CDT.Models.Product>


@{
    ViewBag.Title = @Resources.HomeTitle;
}

    <link rel="stylesheet" type="text/css" href="/includes/marquee.css" />
		<script type="text/javascript" src="/includes/jquery-1.6.min.js"></script>
		<script type="text/javascript" src="/includes/farinspace/jquery.imgpreload.min.js"></script>
		<script type="text/javascript" src="/includes/marquee.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.cookie.js"></script>


            <div  id="panel" >
            <div class="marquee_container autoplay">
                <div class="marquee_photos"></div>
                <div class="marquee_caption">
                    <div class="marquee_caption_content"></div>
                </div>
                <div class="marquee_nav"></div>
            </div>
            
            <div class="marquee_panels">
                <!-- Panel -->
                <div class="marquee_panel" style="">
                    <img class="marquee_panel_photo" src="/images/photos/slide-1.jpg" />
                    <div class="marquee_panel_caption">
                        <br /><br /><br /><br /><br />
                    </div>
                </div>
                <!-- Panel -->
                <div class="marquee_panel">
                    <img class="marquee_panel_photo" src="/images/photos/slide-2.jpg" />
                    <div class="marquee_panel_caption">
                        <br /><br /><br /><br /><br />
                    </div>
                </div>
                <!-- Panel -->
                <div class="marquee_panel">
                    <img class="marquee_panel_photo" src="/images/photos/slide-3.jpg" />
                    <div class="marquee_panel_caption">
                        <br /><br /><br /><br /><br />
                    </div>
                </div>
            </div>
            </div>


<h2>Search</h2>
<hr style="height:5px; background:#ff6a00">

<div class="editor-field">
    <p>Filter by Category: @Html.DropDownList("CategoryId", ViewBag.Category as SelectList, new { onchange="search(this.value);", id="list1"})</p>
</div>

@{
    var list = new SelectList(new[]{new {priceID=1, price = "0 - 99"},
                                    new{priceID=2, price = "100 - 499"},
                                    new{priceID=3, price = "500 - 999"},
                                    new{priceID=4, price = "1000 - 1499"},
                                    new{priceID=5, price = "1500 - 2000"},
                                   },
                            "priceID", "price");
}
<div class="editor-field">
    <p>Filter by : @Html.DropDownList("priceID", list, new { onchange="search();", id="list2"})</p>
</div>

@foreach (var item in Model)
{
    <div class="pro span-5 " style="background:none">
        <img src="@Html.DisplayFor(modelItem => item.ImageUrl)" alt="anh minh hoa"/>
        <br /><br />
        <a href="#">@Html.DisplayFor(modelItem => item.ProductName)</a>
        <br />
        <span>@Html.DisplayFor(modelItem => item.Price)</span>
        <div class="car">@Html.ActionLink(" ", "AddToCart", 
        "ShoppingCart", new { id = item.ProductId }, "")</div>
        @Html.ActionLink("Xem 3D", "ProductDetails", "Product", new { id = @item.ProductId}, new {@class="button"})
    </div>
}

<script>
    function search() {

        searchText = $('[id*=list1]').val();
        if ($('[id*=list2]').val() == 1)
            searchText += "&minVal=0&maxVal=99";
        else
            if ($('[id*=list2]').val() == 2)
                searchText += "&minVal=100&maxVal=499";
            else if ($('[id*=list2]').val() == 3)
                searchText += "&minVal=500&maxVal=999";
            else if ($('[id*=list2]').val() == 4)
                searchText += "&minVal=1000&maxVal=1499";
            else
                if ($('[id*=list2]').val() == 5)
                    searchText += "&minVal=1500&maxVal=2000";
        window.location.href = "../Home/AdvancedSearch?categoryID=" + searchText;
    };
</script>

